<!-- eslint-disable vue/no-use-v-if-with-v-for -->
<template>
  <a-drawer
    width="65%"
    :label-col="4"
    :wrapper-col="14"
    :visible="open"
    :body-style="{ height: 'calc(100vh - 50px)', overflow: 'auto' }"
    @close="cancel"
  >
    <a-spin :spinning="spinning" :delay="delayTime" tip="Loading...">
      <a-row>
        <a-col :span="5">
          <template v-if="isAllowEdit === 1">
            <a-icon
              type="lock"
              v-if="form.isLock == 1"
              style="font-size: 18px; color: red"
              @click="handleLockCustomer(form.id, 0)"
            />
            <a-icon
              type="unlock"
              v-else
              style="font-size: 18px"
              @click="handleLockCustomer(form.id, 1)"
            />
          </template>
          <template v-else>
            <a-icon
              type="lock"
              v-if="form.isLock == 1"
              style="font-size: 18px; color: red"
            />
            <a-icon type="unlock" v-else style="font-size: 18px" />
          </template>

          <span class="cusName"> {{ form.cusName }}</span>

          <a-popover
            title="电话联系记录"
            trigger="hover"
            placement="rightBottom"
          >
            <template #content>
              <template
                v-if="
                  customerShadowList.filter((item) => item.phoneStatus).length >
                  0
                "
              >
                <p
                  v-for="(item, index) in customerShadowList.filter(
                    (item) => item.phoneStatus
                  )"
                  :key="index"
                >
                  {{ item.phoneStatus }} - {{ item.userName }}
                  {{ item.createTime }}
                </p>
              </template>
              <p v-else>{{ "" }}</p>
            </template>

            <!-- 触发元素：仅包裹 <a-badge> -->
            <a-badge
              :count="
                customerShadowList.filter((item) => item.phoneStatus).length
              "
              :number-style="{
                backgroundColor: '#fff',
                color: '#999',
                boxShadow: '0 0 0 1px #d9d9d9 inset',
                fontSize: '8px',
                height: '10px',
                lineHeight: '10px',
                minWidth: '10px',
                padding: '0 2px',
                borderRadius: '5px',
                cursor: 'pointer', // 可选：增加手型光标提示可交互
              }"
            >
              <!-- 图标放在 <a-badge> 内部 -->
              <a-icon
                type="mobile"
                v-if="
                  customerShadowList &&
                  customerShadowList.length > 0 &&
                  customerShadowList.filter((item) => item.phoneStatus).length >
                    0
                "
                theme="filled"
                style="color: green; font-size: 14px; margin-left: 15px"
              />
              <a-icon
                type="mobile"
                v-else
                style="font-size: 14px; margin-left: 15px"
              />
            </a-badge>
          </a-popover>

          <a-popover
            title="微信联系记录"
            trigger="hover"
            placement="rightBottom"
          >
            <template #content>
              <template
                v-if="
                  customerShadowList.filter((item) => item.vxStatus).length > 0
                "
              >
                <p
                  v-for="(item, index) in customerShadowList.filter(
                    (item) => item.vxStatus
                  )"
                  :key="index"
                >
                  {{ item.vxStatus }} - {{ item.userName }}
                  {{ item.createTime }}
                </p>
              </template>
              <p v-else>{{ "" }}</p>
            </template>

            <!-- 触发元素：仅包裹 <a-badge> -->
            <a-badge
              :count="customerShadowList.filter((item) => item.vxStatus).length"
              :number-style="{
                backgroundColor: '#fff',
                color: '#999',
                boxShadow: '0 0 0 1px #d9d9d9 inset',
                fontSize: '8px',
                height: '10px',
                lineHeight: '10px',
                minWidth: '10px',
                padding: '0 2px',
                borderRadius: '5px',
                cursor: 'pointer', // 可选：增加手型光标提示可交互
              }"
            >
              <!-- 图标放在 <a-badge> 内部 -->
              <a-icon
                type="wechat"
                v-if="
                  customerShadowList &&
                  customerShadowList.length > 0 &&
                  customerShadowList.filter((item) => item.vxStatus).length > 0
                "
                theme="filled"
                style="color: green; font-size: 14px; margin-left: 15px"
              />
              <a-icon
                type="wechat"
                v-else
                style="font-size: 14px; margin-left: 15px"
              />
            </a-badge>
          </a-popover>
        </a-col>

        <a-col :span="3" v-if="isAllowEdit === 1">
          <template v-for="tag in tagList">
            <a-tag :key="tag.tagName" color="blue">
              {{ tag.tagName }}
            </a-tag>
          </template>
          <a-button type="dashed" icon="edit" @click="handleTagClick"
            >编辑标签</a-button
          >
        </a-col>

        <template v-if="isAllowEdit === 1">
          <a-col :span="3">
            <a-button type="primary" icon="edit" @click="handleEdit"
              >编辑客户</a-button
            >
          </a-col>
          <!-- <a-col :span="3">
            <a-button
              class="addJinjian"
              icon="plus-square"
              @click="handleShowJinjian"
              >新增进件</a-button
            >
          </a-col> -->
          <a-col :span="3" v-if="isXiezu && form.status !== '7'">
            <a-button
              class="togonghai"
              icon="retweet"
              @click="handleZhuaMyCus('7')"
              >转入公海</a-button
            >
          </a-col>

          <a-col :span="3" v-if="isXiezu && form.status === '7'">
            <a-button
              class="togonghai"
              icon="retweet"
              @click="handleZhuaMyCus('0')"
              >转入我的客户</a-button
            >
          </a-col>
          <a-col :span="3" v-if="isXiezu">
            <a-button icon="stop" @click="handleZhuaMyCus('-3')"
              >加入黑名单</a-button
            >
          </a-col>
          <a-col :span="3" v-if="skipPageVis">
            <a-button
              :disabled="leftDisable"
              icon="left"
              @click="handleLeft()"
            ></a-button>
            <a-button
              :disabled="rightDisable"
              icon="right"
              @click="handleRight()"
            ></a-button>
          </a-col>
        </template>
      </a-row>

      <a-row class="cusInfo">
        <a-col :span="5" class=""
          >跟进状态：{{ processFormat(form.progress) }}</a-col
        >
        <a-col :span="6" class="">最后跟进时间：{{ form.endTime }}</a-col>
        <a-col :span="6" class="">下次跟进时间：{{ form.nextTime }}</a-col>
        <a-col :span="4" class="">客户经理：{{ form.userName }}</a-col>
        <a-col :span="3" class="">客户来源：{{ form.laiyuan }}</a-col>
      </a-row>
      <!-- -->
      <a-tabs
        default-active-key="baseinfo"
        @change="handleGenJincallback"
        v-model="infoTabls"
      >
        <a-tab-pane key="baseinfo" tab="基本信息">
          <a-row>
            <a-col :span="24" v-if="isAllowEdit === 1">
              <a-button
                type="primary"
                icon="form"
                style="width: 100%; height: 42px"
                @click="handleClickGenJin"
                v-if="showGenButton"
                >写跟进记录</a-button
              >
            </a-col>
            <a-col :span="24" style="padding-top: 20px">
              <div style="display: flex; flex-direction: row">
                <span
                  style="
                    width: 5px;
                    height: 22px;
                    background-color: coral;
                    display: block;
                  "
                ></span>
                <span style="margin-left: 5px; height: 22px; line-height: 22px"
                  >基本信息</span
                >
              </div>
            </a-col>
            <a-col :span="24" style="padding-top: 15px; margin-left: 10px">
              <a-descriptions title="">
                <a-descriptions-item label="姓名">
                  <a-input v-model="form.cusName" v-if="edit" />
                  <span v-else> {{ form.cusName || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="电话">
                  <!-- <a-input v-model="form.phone" v-if="edit" /> -->
                  <a-icon
                    type="phone"
                    theme="filled"
                    style="color: #269f70"
                    :rotate="rotate"
                    @click="handcallPhone(form)"
                  />
                  <span>
                    <span v-if="form.phone && !isLook">
                      {{ "*******" + form.phone.substring(7, 11)
                      }}<a-icon
                        type="eye"
                        theme="filled"
                        style="color: #f8643f; font-size: 16px"
                        @click="handleLookPhone(form)"
                    /></span>

                    <span v-else-if="isLook">
                      {{ form.phone
                      }}<a-icon
                        type="eye"
                        style="color: #f8643f; font-size: 16px"
                        @click="handleUnLookPhone()"
                      />
                    </span>
                    <span v-else>"~"</span>
                  </span>
                </a-descriptions-item>
                <a-descriptions-item label="地区城市">
                  <a-input v-model="form.cityName" v-if="edit" />
                  <span v-else> {{ form.cityName || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="申请金额">
                  <a-input-number
                    v-model="form.amount"
                    v-if="edit"
                    :min="0"
                    :max="500"
                    :step="0.5"
                    :formatter="(value) => `${value}万`"
                    :parser="(value) => value.replace('万', '')"
                    :precision="2"
                    placeholder="最多保留2位小数"
                    style="width: 100%"
                  />
                  <span v-else> {{ parseFloat(form.amount) || "~" }} 万</span>
                </a-descriptions-item>
                <a-descriptions-item label="车牌号码">
                  <a-input
                    v-model="form.carNo"
                    v-if="edit"
                    placeholder="输入车牌号码"
                  />
                  <span v-else> {{ form.carNo || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="车辆品牌">
                  <a-input
                    v-model="form.carModel"
                    v-if="edit"
                    placeholder="输入车辆品牌"
                  />
                  <span v-else> {{ form.carModel || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="车辆状态">
                  <a-select
                    style="width: 170px"
                    v-model="form.carStatus"
                    v-if="edit"
                    placeholder="选择车辆状态"
                  >
                    <a-select-option
                      v-for="(item, key) in carStatusOptions"
                      :key="key"
                      :value="item.dictValue"
                    >
                      {{ item.dictLabel }}
                    </a-select-option>
                  </a-select>
                  <span v-else> {{ form.carStatus || "~" }}</span>
                </a-descriptions-item>

                <a-descriptions-item label="上牌日期">
                  <a-date-picker
                    v-if="edit"
                    v-model="form.fuckCarNoTime"
                    value-format="YYYY-MM-DD"
                    placeholder="选择上牌日期"
                    @change="handleCarNoTimeChange()"
                  />

                  <span v-else> {{ form.fuckCarNoTime || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item
                  label="按揭期数"
                  v-if="form.carStatus == '按揭车'"
                >
                  <a-input-number
                    v-model="form.diyaMonths"
                    v-if="edit"
                    :min="0"
                    :max="500"
                    :step="1"
                    :formatter="(value) => `${value}月`"
                    :parser="(value) => value.replace('月', '')"
                    :precision="0"
                    placeholder="请输入整数"
                    style="width: 100%"
                    @change="handleDiyaChange()"
                  />

                  <span v-else> {{ form.diyaMonths || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item
                  label="抵押到期日期"
                  v-if="
                    form.carStatus == '按揭车' || form.carStatus == '抵押车'
                  "
                >
                  <a-date-picker
                    v-model="form.diyaTime"
                    value-format="YYYY-MM-DD"
                    placeholder="抵押到期日期"
                    v-if="edit"
                  />
                  <span v-else>
                    <span v-if="form.diyaTime">
                      {{ form.diyaTime.substring(0, 10) }}
                    </span>
                    <span v-else>"~"</span>
                  </span>
                </a-descriptions-item>

                <a-descriptions-item label="车龄">
                  <a-input-number
                    v-model="form.carAge"
                    v-if="edit"
                    :min="0"
                    :max="500"
                    :step="0.5"
                    :formatter="(value) => `${value}年`"
                    :parser="(value) => value.replace('年', '')"
                    :precision="1"
                    placeholder="最多保留2位小数"
                    style="width: 100%"
                  />
                  <span v-else> {{ parseFloat(form.carAge) || "~" }} 年</span>
                </a-descriptions-item>

                <a-descriptions-item label="公里数">
                  <a-input-number
                    v-model="form.mileage"
                    v-if="edit"
                    :min="0"
                    :max="5000000"
                    :step="1"
                    :formatter="(value) => `${value}km`"
                    :parser="(value) => value.replace('km', '')"
                    :precision="0"
                    placeholder="请输入整数"
                    style="width: 100%"
                  />
                  <span v-else> {{ parseFloat(form.mileage) || "~" }} km</span>
                </a-descriptions-item>

                <a-descriptions-item label="评估价格">
                  <a-input-number
                    v-model="form.pgPrice"
                    v-if="edit"
                    :min="0"
                    :max="500"
                    :step="0.5"
                    :formatter="(value) => `${value}万`"
                    :parser="(value) => value.replace('万', '')"
                    :precision="2"
                    placeholder="最多保留2位小数"
                    style="width: 100%"
                  />
                  <span v-else> {{ parseFloat(form.pgPrice) || "~" }} 万</span>
                </a-descriptions-item>
                <a-descriptions-item label="征信情况">
                  <a-select
                    style="width: 170px"
                    placeholder="选择征信情况"
                    v-model="form.zx"
                    v-if="edit"
                  >
                    <a-select-option
                      v-for="(item, key) in zxInfoOptions"
                      :key="key"
                      :value="item.dictValue"
                    >
                      {{ item.dictLabel }}
                    </a-select-option>
                  </a-select>

                  <span v-else> {{ form.zx || "~" }}</span>
                </a-descriptions-item>

                <a-descriptions-item label="身份证号码">
                  <a-input
                    v-model="form.idCard"
                    v-if="edit"
                    @change="jisuanIdCard"
                  />
                  <span v-else> {{ form.idCard || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="出生日期">
                  <a-date-picker
                    v-if="edit"
                    v-model="form.birthDay"
                    value-format="YYYY-MM-DD"
                    placeholder="选择出生日期"
                    @change="handleBirthDayChange()"
                  />
                  <span v-else> {{ form.birthDay || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="年龄">
                  <a-input-number
                    v-model="form.age"
                    v-if="edit"
                    :min="0"
                    :max="500"
                    :step="1"
                    :formatter="(value) => `${value}岁`"
                    :parser="(value) => value.replace('岁', '')"
                    :precision="1"
                    placeholder="请输入整数"
                    style="width: 100%"
                  />
                  <span v-else> {{ parseFloat(form.age) || "~" }} 岁</span>
                </a-descriptions-item>
                <a-descriptions-item label="性别">
                  <a-select
                    style="width: 170px"
                    placeholder="选择征信情况"
                    v-model="form.sex"
                    v-if="edit"
                  >
                    <a-select-option
                      v-for="(item, key) in sexOptions"
                      :key="key"
                      :value="item.dictValue"
                    >
                      {{ item.dictLabel || "~" }}
                    </a-select-option>
                  </a-select>
                  <span v-else> {{ sexFormat(form.sex) || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="微信号">
                  <a-input v-model="form.wechatNo" v-if="edit" />
                  <span v-else>
                    <span
                      v-if="
                        form.wechatNo && form.wechatNo === form.phone && !isLook
                      "
                    >
                      {{ "*******" + form.wechatNo.substring(7, 11) }}
                      <a-icon
                        type="eye"
                        theme="filled"
                        style="color: #f8643f; font-size: 16px"
                        @click="handleLookPhone(form)"
                    /></span>

                    <span
                      v-else-if="
                        form.wechatNo && form.wechatNo === form.phone && isLook
                      "
                    >
                      {{ form.wechatNo }}
                      <a-icon
                        type="eye"
                        style="color: #f8643f; font-size: 16px"
                        @click="handleUnLookPhone(form)"
                      />
                    </span>
                    <span v-else> {{ form.wechatNo || "~" }}</span>
                  </span>
                </a-descriptions-item>
                <a-descriptions-item label="职业">
                  <a-input v-model="form.works" v-if="edit" />
                  <span v-else> {{ form.works || "~" }}</span>
                </a-descriptions-item>

                <a-descriptions-item label="星级等级">
                  <a-rate
                    v-if="isAllowEdit === 1"
                    v-model="form.level"
                    @change="handlelevelChange"
                  />
                  <a-rate v-else v-model="form.level" disabled />
                </a-descriptions-item>
                <a-descriptions-item label="跟进状态">
                  <a-select
                    style="width: 170px"
                    placeholder="选择跟进状态"
                    v-model="form.progress"
                    v-if="edit"
                  >
                    <a-select-option
                      v-for="(item, key) in progressOptions"
                      :key="key"
                      :value="item.dictValue"
                    >
                      {{ item.dictLabel || "~" }}
                    </a-select-option>
                  </a-select>
                  <span v-else>
                    {{ processFormat(form.progress) || "~" }}
                  </span>
                </a-descriptions-item>
              </a-descriptions>
            </a-col>
          </a-row>

          <a-row>
            <a-col :span="24">
              <div style="display: flex; flex-direction: row">
                <span
                  style="
                    width: 5px;
                    height: 22px;
                    background-color: coral;
                    display: block;
                  "
                ></span>
                <span style="margin-left: 5px; height: 22px; line-height: 22px"
                  >资产信息</span
                >
              </div>
            </a-col>

            <a-col :span="24" style="padding-top: 15px; margin-left: 10px">
              <a-descriptions title="">
                <a-descriptions-item label="资产类型">
                  <a-select
                    mode="multiple"
                    placeholder="选择资产类型"
                    style="width: 170px"
                    v-model="form.otherZc"
                    v-if="edit"
                  >
                    <a-select-option
                      v-for="(item, key) in zhichanInfoOptions"
                      :key="key"
                      :value="item.dictValue"
                    >
                      {{ item.dictLabel }}
                    </a-select-option>
                  </a-select>
                  <span v-else>
                    <a-tag
                      v-for="(item, key) in form.otherZc"
                      :key="key"
                      color="orange"
                      >{{ item }}
                    </a-tag>
                  </span>
                </a-descriptions-item>

                <a-descriptions-item label="工资发放形式">
                  <a-input v-model="form.payoffType" v-if="edit" />
                  <span v-else> {{ form.payoffType || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="收入">
                  <a-input v-model="form.incomeMonth" v-if="edit" />
                  <span v-else> {{ form.incomeMonth || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="芝麻分">
                  <a-input v-model="form.sesameScore" v-if="edit" />
                  <span v-else> {{ form.sesameScore || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="借款期限">
                  <a-input v-model="form.loanExpiresMonth" v-if="edit" />
                  <span v-else> {{ form.loanExpiresMonth || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="借款用途">
                  <a-input v-model="form.loanUse" v-if="edit" />
                  <span v-else> {{ form.loanUse || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="保单范围">
                  <a-input v-model="form.baodanScop" v-if="edit" />
                  <span v-else> {{ form.baodanScop || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="微粒贷">
                  <a-input v-model="form.isLoans" v-if="edit" />
                  <span v-else> {{ form.isLoans || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="经营年限">
                  <a-input v-model="form.manageYears" v-if="edit" />
                  <span v-else> {{ form.manageYears || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="总经营流水">
                  <a-input v-model="form.turnover" v-if="edit" />
                  <span v-else> {{ form.turnover || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="公账营收入">
                  <a-input v-model="form.turnoverPublic" v-if="edit" />
                  <span v-else> {{ form.turnoverPublic || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="单位工龄">
                  <a-input v-model="form.workingYears" v-if="edit" />
                  <span v-else> {{ form.workingYears || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="经营注册地">
                  <a-input v-model="form.registAddress" v-if="edit" />
                  <span v-else> {{ form.registAddress || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="营业执照">
                  <a-input v-model="form.hasBusinessLicense" v-if="edit" />
                  <span v-else> {{ form.hasBusinessLicense || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="信用卡">
                  <a-input v-model="form.creditCard" v-if="edit" />
                  <span v-else> {{ form.creditCard || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="渠道名称">
                  <a-input v-model="form.apiSourceName" v-if="edit" />
                  <span v-else> {{ form.apiSourceName || "~" }}</span>
                </a-descriptions-item>
                <a-descriptions-item label="获客品牌">
                  <a-input v-model="form.brand" v-if="edit" />
                  <span v-else> {{ form.brand || "~" }}</span>
                </a-descriptions-item>
              </a-descriptions>
            </a-col>
          </a-row>

          <a-row style="margin-top: 15px">
            <a-col :span="24">
              <div style="display: flex; flex-direction: row">
                <span
                  style="
                    width: 5px;
                    height: 22px;
                    background-color: coral;
                    display: block;
                  "
                ></span>
                <span style="margin-left: 5px; height: 22px; line-height: 22px"
                  >备注信息</span
                >
              </div>
            </a-col>
            <a-col :span="22" style="padding-top: 15px; margin-left: 10px">
              <a-textarea
                v-model="form.remark"
                v-if="edit"
                :rows="3"
              ></a-textarea>
              <a-descriptions title="" v-else>
                <a-descriptions-item label="">
                  <span> {{ form.remark || "~" }}</span>
                </a-descriptions-item>
              </a-descriptions>
            </a-col>
          </a-row>
          <a-row v-if="edit" style="margin-top: 20px; padding-left: 15px">
            <a-col :span="3">
              <a-button type="primary" @click="handleSaveEdit">保存</a-button>
            </a-col>
            <a-col :span="3"
              ><a-button type="" @click="handleCanelEdit">取消</a-button></a-col
            >
          </a-row>
        </a-tab-pane>

        <a-tab-pane key="genjin" tab="跟进记录">
          <a-row>
            <a-col :span="24" v-if="isAllowEdit === 1">
              <a-button
                type="primary"
                icon="form"
                style="width: 100%; height: 42px"
                @click="handleClickGenJin"
                v-if="showGenButton"
                >写跟进记录</a-button
              >
            </a-col>
            <a-col :span="24">
              <a-card
                :bordered="true"
                style="padding: 10px; background-color: #fafafa"
                v-if="isinputshow"
              >
                <a-row>
                  <a-col :span="24">
                    <a-checkbox
                      v-for="dict in phoneStatusOptions"
                      :key="dict.dictValue"
                      :value="dict.dictValue"
                      :checked="dict.dictValue === sform.phoneStatus"
                      @change="
                        (e) => handleCheckboxChange(e, 'phone', dict.dictValue)
                      "
                    >
                      {{ dict.dictLabel }}
                    </a-checkbox>
                    <a-checkbox
                      v-for="dict in vxStatusOptions"
                      :key="dict.dictValue"
                      :value="dict.dictValue"
                      :checked="dict.dictValue === sform.vxStatus"
                      @change="
                        (e) => handleCheckboxChange(e, 'vx', dict.dictValue)
                      "
                    >
                      {{ dict.dictLabel }}
                    </a-checkbox>
                    <a-checkbox
                      v-for="dict in wishStatusOptions"
                      :key="dict.dictValue"
                      :value="dict.dictValue"
                      :checked="dict.dictValue === sform.wishStatus"
                      @change="
                        (e) => handleCheckboxChange(e, 'wish', dict.dictValue)
                      "
                    >
                      {{ dict.dictLabel }}
                    </a-checkbox>
                  </a-col>
                </a-row>

                <a-row style="margin-top: 20px">
                  <!-- <a-col :span="3" style="margin-top: 10px">
                    <span>发送短信：</span>
                    <a-switch
                      checked-children="是"
                      un-checked-children="否"
                      @change="handleContactSms"
                    />
                  </a-col> -->

                  <a-col
                    :span="4"
                    style="
                      margin-right: 5px;
                      display: flex;
                      align-items: center;
                    "
                    v-if="sform.vxStatus == '已加微'"
                  >
                    <span style="margin-right: 8px; white-space: nowrap"
                      >微信号：</span
                    >
                    <a-form-model-item
                      label=""
                      prop="wechatNo"
                      style="margin-bottom: 0; flex: 1"
                    >
                      <template v-if="form.wechatNo !== form.phone">
                        <a-input v-model="form.wechatNo" />
                      </template>
                      <template v-else>
                        <div
                          v-if="!isVxLook"
                          style="display: flex; align-items: center; gap: 8px"
                        >
                          <span>{{
                            "*******" + form.wechatNo.substring(7, 11)
                          }}</span>
                          <a-icon
                            type="eye"
                            theme="filled"
                            style="
                              color: #f8643f;
                              font-size: 16px;
                              cursor: pointer;
                            "
                            @click="handleLookVxPhone(form)"
                          />
                        </div>

                        <div
                          v-if="isVxLook"
                          style="display: flex; align-items: center; gap: 8px"
                        >
                          <a-input v-model="form.wechatNo" style="flex: 1" />
                          <a-icon
                            type="eye"
                            style="
                              color: #f8643f;
                              font-size: 16px;
                              cursor: pointer;
                            "
                            @click="handleUnLookVxPhone(form)"
                          />
                        </div>
                      </template>
                    </a-form-model-item>
                  </a-col>
                  <a-col
                    :span="4"
                    style="
                      margin-right: 5px;
                      display: flex;
                      align-items: center;
                    "
                  >
                    <a-form-model-item label="" prop="nextTime">
                      <a-date-picker
                        v-model="sform.nextTime"
                        value-format="YYYY-MM-DD HH:mm:ss"
                        :show-today="true"
                        placeholder="选择下次跟进时间"
                        show-time
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
                <a-row>
                  <a-col :span="24" style="margin-top: -15px">
                    <a-tag
                      color="#108ee9"
                      v-for="(item, k) in genjinQuckitInputOptions"
                      :key="k"
                      @click="handleGenJinkInput(item.dictValue)"
                      >{{ item.dictLabel }}</a-tag
                    >
                    <a-tooltip>
                      <template slot="title">
                        快捷输入可在系统设置-字典管理-跟进快捷输入添加
                      </template>
                      <a-icon type="question-circle" style="color: red" />
                    </a-tooltip>
                  </a-col>
                  <a-col :span="24" style="margin-top: 10px">
                    <a-textarea
                      v-model="sform.takes"
                      placeholder="勤跟单，多签单"
                      :auto-size="{ minRows: 3, maxRows: 5 }"
                      allowClear
                  /></a-col>

                  <a-col :span="3" style="margin-top: 15px">
                    <span>邀约上门：</span>
                    <a-switch
                      checked-children="是"
                      un-checked-children="否"
                      @change="
                        (checked) => (isaddimage = checked ? true : false)
                      "
                    />
                  </a-col>


                    <a-col :span="5" style="margin-top: 10px" v-if="isaddimage">
                        <a-date-picker
                          v-model="sform.toHomeTime"
                          value-format="YYYY-MM-DD HH:mm:ss"
                          :show-today="true"
                          placeholder="选择邀约上门时间"
                          show-time
                          style="width: 100%"
                        />
                    </a-col>
                    <a-col
                      :span="5"
                      style="margin-top: 10px; margin-left: 15px"
                      v-if="isaddimage"
                    >
                        <a-select
                          placeholder="请选择上门门店"
                          v-model="sform.companyNames"
                          style="width: 100%"
                          allow-clear
                        >
                          <a-select-option
                            v-for="(d, index) in companyList"
                            :key="index"
                            :value="d.companyName"
                            >{{ d.companyName }}</a-select-option
                          >
                        </a-select>
                    </a-col>
                  </a-form-model>
                  <a-col
                    :span="3"
                    style="margin-top: 15px; margin-left: 15px"
                    v-if="isaddimage"
                  >
                    <span>短信通知客户：</span>
                    <a-switch
                      checked-children="是"
                      un-checked-children="否"
                      @change="(checked) => (isSms = checked ? true : false)"
                    />
                  </a-col>


                   <a-col
                    :span="5"
                    style="margin-top: 15px; margin-left: 15px"
                    v-if="isaddimage"
                  >
                    <span>企业微信群提醒：</span>
                    <a-switch
                      checked-children="是"
                      un-checked-children="否"
                      @change="(checked) => (isVxs = checked ? true : false)"
                    />
                  </a-col>

                </a-row>
                <a-row>
                  <a-col :span="12" style="margin-top: 10px; text-align: left">
                    <a-button
                      icon="cloud-upload"
                      @click="showAddFile = true"
                      type="primary"
                      v-if="isAllowEdit === 1"
                      >上传附件</a-button
                    >

                    <a-tooltip style="margin-left: 5px">
                      <template slot="title">
                        上传后可以在附件管理中查看附件
                      </template>
                      <a-icon type="question-circle" style="color: red" />
                    </a-tooltip>
                  </a-col>
                  <a-col :span="12" style="margin-top: 15px; text-align: right">
                    <a-button
                      @click="
                        isinputshow = false;
                        showGenButton = true;
                      "
                      style="margin-right: 15px"
                      shape="round"
                    >
                      取消
                    </a-button>
                    <a-button
                      type="primary"
                      @click="shadowSubimt"
                      shape="round"
                      :loading="isShadowSubimt"
                    >
                      保存
                    </a-button>
                  </a-col>
                </a-row>
              </a-card>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="24" style="margin-left: 0px; margin-top: 5px">
              <a-card
                :bordered="false"
                style="height: 65vh; overflow-y: auto"
                v-if="customerShadowList.length > 0"
              >
                <div
                  v-for="(item, index) in customerShadowList"
                  :key="index"
                  style="
                    border-radius: 5px;
                    border: 1px solid #ecedee;
                    margin-top: 15px;
                  "
                >
                  <a-row>
                    <a-col
                      :span="24"
                      style="
                        font-size: 16px;
                        color: #111;
                        padding: 10px 0px 0px 20px;
                        font-weight: 500;
                      "
                    >
                      {{ item.userName }}
                      <span v-if="item.xiezu == 1">(协助)</span>
                    </a-col>
                    <a-col :span="24">
                      <!-- background-color: #f8f8f863; -->
                      <div
                        style="
                          margin: 5px 30px;
                          background-color: #f8f8f863;
                          padding: 10px 15px;
                          border-radius: 5px;
                        "
                      >
                        <div
                          style="
                            font-size: 15px;
                            color: #111;
                            padding: 0px 5px 5px 5px;
                          "
                        >
                          {{ item.takes }}
                        </div>
                        <div
                          style="
                            font-size: 12px;
                            color: #666;
                            padding: 5px 5px 0px 5px;
                            border-top: 1px solid #eee;
                          "
                        >
                          <a-icon type="history" />
                          {{ item.createTime }}
                          <span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                          <a-icon type="phone" />
                          <span v-if="item.phoneStatus || item.vxStatus">
                            {{ item.phoneStatus ? item.phoneStatus : "" }}
                            {{ item.phoneStatus && item.vxStatus ? "-" : "" }}
                            {{ item.vxStatus ? item.vxStatus : "" }}
                          </span>
                          <span v-else> ~ ~</span>

                          <span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                          <a-icon type="alert" style="color: orange" />
                          下次跟进时间：
                          {{ item.nextTime || "~ ~" }}
                          <span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                          <span v-if="item.toHomeTime">
                            <a-icon type="tags" style="color: #f56c6c" />
                            <span style="color: #f56c6c"> 上门时间：</span>
                            {{ item.toHomeTime || "~ ~" }}
                          </span>

                          <span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                          <span v-if="item.companyNames">
                            <a-icon type="tags" style="color: #f56c6c" />
                            <span style="color: #f56c6c"> 上门门店：</span>{{ item.companyNames || "~ ~" }}
                          </span>

                          <span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                          <a-button
                            type="link"
                            icon="aliwangwang"
                            @click="
                              handleGetPingLunList(
                                item,
                                item.isShowPinglun ? false : true
                              )
                            "
                            >查看评论({{ item.pinglunCounts }})</a-button
                          ><span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                          <a-button
                            type="link"
                            icon="message"
                            @click="
                              item.ispinglun = item.ispinglun ? false : true
                            "
                            >评论</a-button
                          >
                        </div>
                        <div style="margin-top: 10px"></div>
                        <div
                          style="
                            font-size: 12px;
                            color: #999;
                            padding: 0px 5px 5px 5px;
                          "
                          v-if="item.isShowPinglun"
                          v-for="(pinglun, index) in pinglunList"
                          :key="index"
                        >
                          {{ pinglun.userName }}（{{
                            pinglun.createTime
                          }}）评论：
                          {{ pinglun.content }}
                        </div>
                      </div>
                    </a-col>
                    <a-col :span="24" v-if="item.ispinglun">
                      <div style="margin: 5px 30px; padding: 0px">
                        <a-textarea
                          type="textarea"
                          :rows="3"
                          placeholder="请输入评论内容"
                          v-model="item.remark"
                          :auto-size="{ minRows: 2, maxRows: 4 }"
                        ></a-textarea>
                      </div>
                    </a-col>
                    <a-col :span="24" v-if="item.ispinglun">
                      <div
                        style="
                          margin: 5px 30px;
                          padding: 0px;
                          text-align: right;
                        "
                      >
                        <a-button
                          type="primary"
                          @click="handlepinglun(item)"
                          style="margin-right: 20px"
                          >评论</a-button
                        >
                        <a-button @click="item.ispinglun = false">
                          取消</a-button
                        >
                      </div>
                    </a-col>
                  </a-row>
                </div>
              </a-card></a-col
            >
            <a-col
              :span="24"
              v-if="customerShadowList.length === 0"
              style="text-align: center"
            >
              <a-empty
                image="https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original"
                :image-style="{
                  height: '60px',
                }"
              >
                <span slot="description"> 暂无跟进记录 </span>
              </a-empty>
            </a-col>
          </a-row>
        </a-tab-pane>
        <a-tab-pane key="jinjian" tab="业务进件">
          <a-row>
            <a-col :span="24" v-if="isAllowEdit === 1">
              <a-button
                type="primary"
                icon="form"
                style="width: 100%; height: 42px"
                @click="handleClickGenJin"
                v-if="showGenButton"
                >写跟进记录</a-button
              >
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="24" style="margin-left: 10px; margin-top: 20px">
              <a-card
                :bordered="false"
                style="height: 60vh; overflow-y: auto; padding: 20px 0 0 10px"
                v-if="jinjianInfoList.length > 0"
              >
                <a-timeline>
                  <span v-for="(item, index) in jinjianInfoList" :key="index">
                    <a-timeline-item color="green">
                      <a-icon
                        slot="dot"
                        type="clock-circle-o"
                        style="font-size: 16px"
                      />
                      <div class="genjinitem">
                        申请时间：<a-badge
                          status="success"
                          :text="item.createTime"
                        />
                      </div>
                      <div class="genjinitem">
                        服务机构与产品：{{ orgTypeFormat(item.orgType) }}/{{
                          item.productName
                        }}
                      </div>
                      <div class="genjinitem">
                        申请金额:： ¥
                        {{ parseFloat(item.yxEdu ? item.yxEdu : 0).toFixed(2) }}
                      </div>
                      <div class="genjinitem">
                        放款金额：¥
                        {{ parseFloat(item.sjEdu ? item.sjEdu : 0).toFixed(2) }}
                      </div>
                      <div class="genjinitem">
                        状态：<a-tag
                          color="#108ee9"
                          v-if="item.jinjianStatus == 3"
                        >
                          审批通过
                        </a-tag>
                        <a-tag
                          color="red"
                          v-else-if="item.jinjianStatus == '-1'"
                          >未通过
                        </a-tag>
                        <a-tag
                          color="green"
                          v-else-if="item.jinjianStatus == '8'"
                          >签约成功
                        </a-tag>
                        <a-tag color="orange" v-else>待审批 </a-tag>
                      </div>
                      <div class="genjinitem">
                        服务费用： ¥
                        {{
                          parseFloat(
                            item.serviceAmount ? item.serviceAmount : 0
                          ).toFixed(2)
                        }}
                      </div>
                      <div class="genjinitem">
                        费用备注：{{ item.serviceAmountRemark }}
                      </div>
                    </a-timeline-item>
                  </span>
                </a-timeline>
              </a-card></a-col
            >
            <a-col
              :span="24"
              v-if="jinjianInfoList.length === 0"
              style="text-align: center"
            >
              <a-empty
                image="https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original"
                :image-style="{
                  height: '60px',
                }"
              >
                <span slot="description"> 暂无进件记录 </span>
              </a-empty>
            </a-col>
          </a-row>
        </a-tab-pane>
        <a-tab-pane key="dongtai" tab="客户动态">
          <a-row>
            <a-col :span="24" v-if="isAllowEdit === 1">
              <a-button
                type="primary"
                icon="form"
                style="width: 100%; height: 42px"
                @click="handleClickGenJin"
                v-if="showGenButton"
                >写跟进记录</a-button
              >
            </a-col>
          </a-row>
          <a-row type="flex" justify="end">
            <a-col :span="4" style="margin-top: 10px; text-align: right">
              <a-select
                v-model="queryParam.dongtaiType"
                @change="handleDongtaiTypeChange"
                style="width: 100%"
                allow-clear
                placeholder="全部"
              >
                <a-select-option
                  v-for="(d, index) in dongtaiTypeOptions.filter(d => d.dictValue !== '-1')"
                  :key="index"
                  :value="d.dictValue"
                  >{{ d.dictLabel }}</a-select-option
                >
              </a-select>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="24">
              <a-timeline
                style="height: 65vh; overflow-y: auto"
                v-if="customerDongtaiList.length > 0"
              >
                <a-timeline-item
                  v-for="(item, index) in customerDongtaiList"
                  :key="index"
                  style="margin-left: 10px; margin-top: 10px"
                >
                  <a-icon
                    slot="dot"
                    type="clock-circle-o"
                    style="font-size: 14px"
                  />
                  {{ item.createTime }}
                  <div style="color: #111">客户动态：{{ item.content }}</div>
                </a-timeline-item>
              </a-timeline>
            </a-col>

            <a-col :span="24">
              <div style="width: 100%; height: 45px; padding-top: 15px">
                <a-pagination
                  size="small"
                  :total="dongtaitotal"
                  :show-total="(total) => `共计 ${dongtaitotal} 条`"
                  @change="handleDongtaiPages"
                />
              </div>
            </a-col>

            <a-col
              :span="24"
              v-if="customerDongtaiList.length === 0"
              style="text-align: center"
            >
              <a-empty
                image="https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original"
                :image-style="{
                  height: '60px',
                }"
              >
                <span slot="description"> 暂无动态 </span>
              </a-empty>
            </a-col>
          </a-row>
        </a-tab-pane>


     <a-tab-pane key="jinjianDongtai" tab="业务动态">
          <a-row>
            <a-col :span="24" v-if="isAllowEdit === 1">
              <a-button
                type="primary"
                icon="form"
                style="width: 100%; height: 42px"
                @click="handleClickGenJin"
                v-if="showGenButton"
                >写跟进记录</a-button
              >
            </a-col>
          </a-row>
          <a-row type="flex" justify="end">
            <a-col :span="4" style="margin-top: 10px; text-align: right">
              <a-select
                v-model="queryParam.dongtaiType"
                @change="handleDongtaiTypeChange"
                style="width: 100%"
                allow-clear
                placeholder="全部"
              >
                <a-select-option
                  v-for="(d, index) in dongtaiTypeOptions.filter(d => d.dictValue === '-1')"
                  :key="index"
                  :value="d.dictValue"
                  >{{ d.dictLabel }}</a-select-option
                >
              </a-select>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="24">
              <a-timeline
                style="height: 65vh; overflow-y: auto"
                v-if="customerDongtaiList.length > 0"
              >
                <a-timeline-item
                  v-for="(item, index) in customerDongtaiList"
                  :key="index"
                  style="margin-left: 10px; margin-top: 10px"
                >
                  <a-icon
                    slot="dot"
                    type="clock-circle-o"
                    style="font-size: 14px"
                  />
                  {{ item.createTime }}
                  <div style="color: #111">客户动态：{{ item.content }}</div>
                </a-timeline-item>
              </a-timeline>
            </a-col>

            <a-col :span="24">
              <div style="width: 100%; height: 45px; padding-top: 15px">
                <a-pagination
                  size="small"
                  :total="dongtaitotal"
                  :show-total="(total) => `共计 ${dongtaitotal} 条`"
                  @change="handleDongtaiPages"
                />
              </div>
            </a-col>

            <a-col
              :span="24"
              v-if="customerDongtaiList.length === 0"
              style="text-align: center"
            >
              <a-empty
                image="https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original"
                :image-style="{
                  height: '60px',
                }"
              >
                <span slot="description"> 暂无动态 </span>
              </a-empty>
            </a-col>
          </a-row>
        </a-tab-pane>

        <a-tab-pane key="xiezhu" tab="协助管理">
          <a-col :span="24" v-if="isAllowEdit === 1">
            <a-button
              type="primary"
              icon="form"
              style="width: 100%; height: 42px"
              @click="handleClickGenJin"
              v-if="showGenButton"
              >写跟进记录</a-button
            >
          </a-col>
          <a-col :span="24" style="margin-top: 10px; text-align: left">
            当前协助人员：<span v-if="xiezuInfoList.length == 0"
              >暂无协助人员</span
            >
            <a-tag
              v-for="(item, index) in xiezuInfoList"
              :key="index"
              color="#108ee9"
              closable
              @close="handleDeleteCustomerXieZu(item.id)"
            >
              {{ item.xiezuName }}
            </a-tag>
          </a-col>
          <a-col
            :span="24"
            style="margin-top: 10px; text-align: left"
            v-if="isXiezu"
          >
            <a-button
              v-if="isAllowEdit === 1"
              icon="user"
              style="height: 32px"
              @click="xiezuVisible = true"
              type="primary"
              >请求员工协助</a-button
            >
          </a-col>
          <a-col :span="24" style="margin-top: 10px" v-if="xiezuVisible">
            <a-row>
              <a-col :span="6"> </a-col>
              <a-col :span="1"> </a-col>
              <a-col :span="17">
                <a-row>
                  <a-col :span="24">
                    <a-form-model
                      ref="ruleForm"
                      :model="xiezuform"
                      :rules="xiezurules"
                      :label-col="labelCol"
                      :wrapper-col="wrapperCol"
                      ><a-form-model-item label="客户">
                        <a-input
                          v-model="form.cusName"
                          disabled
                        /> </a-form-model-item
                      ><a-form-model-item label="协助员工">
                        <a-select
                          mode="multiple"
                          v-model="xiezuform.xiezuUsers"
                          style="width: 100%"
                          placeholder="选择协助员工"
                          :open="false"
                          @focus="chooseUserVisible = true"
                          :autoClearSearchValue="false"
                        >
                          <a-select-option
                            v-for="item in xiezuUserList"
                            :key="item.id"
                            :value="item.id"
                          >
                            {{ item.name }}
                          </a-select-option>
                        </a-select> </a-form-model-item
                      ><a-form-model-item label="协助备注">
                        <a-input
                          type="textarea"
                          :rows="5"
                          v-model="xiezuform.remark"
                        /> </a-form-model-item
                    ></a-form-model>
                  </a-col>
                </a-row>
              </a-col>
              <a-col :span="12" style="text-align: right">
                <a-button
                  type="primary"
                  icon="share-alt"
                  @click="handleAddXieZuInfo"
                  >提交协助</a-button
                >
              </a-col>
              <a-col :span="6" style="text-align: left; margin-left: 30px">
                <a-button
                  icon="close"
                  @click="
                    xiezuVisible = false;
                    xiezuUserList = [];

                    xiezuform.xiezuUsers = [];
                  "
                  >取消协助</a-button
                >
              </a-col>
            </a-row>
          </a-col>
          <a-col
            :span="24"
            v-if="xiezuInfoList.length === 0 && !xiezuVisible"
            style="text-align: center"
          >
            <a-empty
              image="https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original"
              :image-style="{
                height: '60px',
              }"
            >
              <span slot="description"> 暂无协助记录 </span>
            </a-empty>
          </a-col>
          <a-col
            :span="24"
            v-if="xiezuList.length > 0 && !xiezuVisible"
            style="margin-top: 20px"
          >
            <a-card :bordered="false" style="height: 60vh; overflow-y: auto">
              <a-table :data-source="xiezuList" bordered size="middle">
                <a-table-column
                  key="createTime"
                  data-index="createTime"
                  title="操作时间"
                  width="170px"
                ></a-table-column>
                <a-table-column
                  key="userName"
                  data-index="userName"
                  title="操作人"
                  width="110px"
                ></a-table-column>
                <a-table-column
                  key="xiezuUserNames"
                  data-index="xiezuUserNames"
                  title="协助人"
                ></a-table-column>
              </a-table>
            </a-card>
          </a-col>
        </a-tab-pane>
        <a-tab-pane key="file" tab="附件管理">
          <a-row>
            <a-col :span="24" v-if="isAllowEdit === 1">
              <a-button
                type="primary"
                icon="form"
                style="width: 100%; height: 42px"
                @click="handleClickGenJin"
                v-if="showGenButton"
                >写跟进记录</a-button
              >
            </a-col>
            <a-col :span="24" style="margin-top: 10px; text-align: right">
              <a-button
                icon="cloud-upload"
                style="height: 32px"
                @click="showAddFile = true"
                type="primary"
                v-if="isAllowEdit === 1"
                >上传附件</a-button
              >
            </a-col>
            <a-col
              :span="24"
              v-if="
                customerFileList.filter(
                  (item) => item.type !== 'call_phone_list'
                ).length === 0
              "
              style="text-align: center"
            >
              <a-empty
                image="https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original"
                :image-style="{
                  height: '60px',
                }"
              >
                <span slot="description"> 暂无文件资料 </span>
              </a-empty>
            </a-col>
            <a-col :span="12" v-else>
              <a-timeline>
                <a-timeline-item
                  v-for="(item, key) in customerFileList.filter(
                    (item) => item.type !== 'call_phone_list'
                  )"
                  :key="key"
                  style="margin-top: 10px"
                >
                  <a-col :span="8">{{ item.createTime }}</a-col>
                  <a-col :span="4">
                    <a-button
                      type="link"
                      block
                      @click="
                        previewVisible = true;
                        previewImage = item.url;
                        previewTitle =
                          '【' +
                          form.cusName +
                          '】' +
                          fileTypeFormat(item.type);
                      "
                    >
                      查看{{ fileTypeFormat(item.type) }}
                    </a-button>
                    <!-- <img
                      :src="item.url"
                      style="height: 50px; width: 80px"
                      @click="
                        previewVisible = true;
                        previewImage = item.url;
                      "
                    /> -->
                  </a-col>
                </a-timeline-item>
              </a-timeline>
            </a-col>
          </a-row>
        </a-tab-pane>
        <a-tab-pane key="tonghuajilu" tab="通话记录">
          <a-row>
            <a-col :span="24" v-if="isAllowEdit === 1">
              <a-button
                type="primary"
                icon="form"
                style="width: 100%; height: 42px"
                @click="handleClickGenJin"
                v-if="showGenButton"
                >写跟进记录</a-button
              >
            </a-col>
            <a-col
              :span="24"
              v-if="
                customerFileList.filter(
                  (file) => file.type === 'call_phone_list'
                ).length === 0
              "
              style="text-align: center"
            >
              <a-empty
                image="https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original"
                :image-style="{
                  height: '60px',
                }"
              >
                <span slot="description"> 暂无通话记录 </span>
              </a-empty>
            </a-col>
            <a-col :span="24" v-else>
              <a-timeline>
                <a-timeline-item
                  v-for="(item, key) in customerFileList.filter(
                    (file) => file.type === 'call_phone_list'
                  )"
                  :key="key"
                  style="margin-top: 50px"
                >
                  <a-col :span="4" style="text-align: center">{{
                    item.createTime
                  }}</a-col>
                  <a-col :span="4">
                    <audio-player :audio-url="item.url" />
                  </a-col>
                </a-timeline-item>
              </a-timeline>
            </a-col>
          </a-row>
        </a-tab-pane>
        <a-tab-pane key="zifang" tab="资方进件">
          <a-row>
            <a-col :span="24" v-if="isAllowEdit === 1">
              <a-button
                type="primary"
                icon="form"
                style="width: 100%; height: 42px"
                @click="handleClickGenJin"
                v-if="showGenButton"
                >写跟进记录</a-button
              >
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="24" style="margin-left: 10px; margin-top: 20px">
              <a-card
                :bordered="false"
                style="height: 60vh; overflow-y: auto; padding: 20px 0 0 10px"
                v-if="zifangInfoList.length > 0"
              >
                <a-timeline>
                  <span v-for="(item, index) in zifangInfoList" :key="index">
                    <a-timeline-item color="green">
                      <a-icon
                        slot="dot"
                        type="clock-circle-o"
                        style="font-size: 16px"
                      />
                      <div class="genjinitem">
                        申请时间：<a-badge
                          status="success"
                          :text="item.createTime"
                        />
                      </div>
                      <div class="genjinitem">申请人：{{ item.userName }}</div>
                      <div class="genjinitem">进件编号：{{ item.id }}</div>
                      <div class="genjinitem">
                        资方渠道：{{ item.qudaoType }}
                      </div>

                      <div class="genjinitem">
                        放款金额：¥
                        {{
                          parseFloat(item.amount ? item.amount : 0).toFixed(2)
                        }}
                      </div>
                      <div class="genjinitem">
                        更新时间：{{ item.updateTime }}
                      </div>
                      <div class="genjinitem">备注：{{ item.remark }}</div>
                    </a-timeline-item>
                  </span>
                </a-timeline>
              </a-card></a-col
            >
            <a-col
              :span="24"
              v-if="jinjianInfoList.length === 0"
              style="text-align: center"
            >
              <a-empty
                image="https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original"
                :image-style="{
                  height: '60px',
                }"
              >
                <span slot="description"> 暂无资方记录 </span>
              </a-empty>
            </a-col>
          </a-row>
        </a-tab-pane>
      </a-tabs>
    </a-spin>
    <div class="bottom-control">
      <a-space>
        <a-button @click="cancel"> 关 闭 </a-button>
      </a-space>
    </div>
    <a-modal
      :visible="showAddFile"
      :title="'添加【' + form.cusName + '】文件资料'"
      v-if="showAddFile"
      @cancel="handlefileClose"
      @ok="handlefileConfirm"
      okText="保存文件"
    >
      <a-form-model
        :model="fileform"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
      >
        <a-form-model-item label="文件类型" prop="fileType">
          <a-radio-group v-model="fileform.type" button-style="solid">
            <a-radio-button
              v-for="(dict, index) in fujianTypeOptions.filter(
                (item) => item.dictValue !== 'call_phone_list'
              )"
              :key="index"
              :value="dict.dictValue"
            >
              {{ dict.dictLabel }}
            </a-radio-button>
          </a-radio-group>
        </a-form-model-item>

        <a-form-model-item label="上传文件">
          <a-upload
            name="file"
            :multiple="false"
            :action="upload.url + '/common/upload'"
            :headers="upload.headers"
            list-type="picture"
            @change="handleChange"
            accept="image/*"
          >
            <div v-if="defaultFileList.length < 1">
              <a-button> <a-icon type="link" />点击上传</a-button>
            </div>
          </a-upload>
        </a-form-model-item>
      </a-form-model>
    </a-modal>
    <a-modal
      :visible="previewVisible"
      :footer="null"
      @cancel="previewVisible = false"
      v-drag-modal
      :title="previewTitle"
    >
      <img alt="example" style="width: 100%" :src="previewImage" />
    </a-modal>
    <a-modal
      :visible="chooseUserVisible"
      title="选择协助同事"
      v-if="chooseUserVisible"
      width="55%"
      @ok="chooseUserVisible = false"
      @cancel="chooseUserVisible = false"
      :dialog-style="{ top: '10px' }"
    >
      <change-user
        @getUser="handleManualShare"
        :isCheckBox="true"
        :isKefu="2"
        :postIds="postIds"
      />
    </a-modal>

    <a-modal
      :visible="chooseTagVisible"
      title="选择标签"
      v-show="chooseTagVisible"
      width="40%"
      @ok="tagOk"
      @cancel="tagCancel"
      :dialog-style="{ top: '10px' }"
    >
      <tag-select ref="tagSelect" @getTag="handleCheckTag" />
    </a-modal>

    <!--预审申请-->
    <biz-jinjian-info-add-yushen-shenqin-form
      v-if="showEditModal"
      ref="bizJinjianInfoEditForm"
      :customerInfo="customerInfo"
      :jinjianTypeOptions="jinjianTypeOptions"
      :backTypeOptions="backTypeOptions"
      :orgTypeOptions="orgTypeOptions"
      :jinjianStatus="2"
      :zifangTypeOptions="zifangTypeOptions"
      @ok="
        showEditModal = false;
        handleGenJincallback('jinjian');
        infoTabls = 'jinjian';
      "
      @close="
        showEditModal = false;
        infoTabls = 'jinjian';
      "
    />
  </a-drawer>
</template>
<script>
import BizCustomerInfoEditForm from "./BizCustomerForm";
export default {
  ...BizCustomerInfoEditForm,
};
</script>
<style scoped lang="less">
.cusName {
  color: #f8643f;
  font-size: 16px;
  font-weight: 400;
}
.addJinjian {
  color: #fff;
  background-color: #67c23a;
  border-color: #67c23a;
}
.togonghai {
  color: #fff;
  background-color: #e6a23c;
  border-color: #e6a23c;
}
.cusInfo {
  background: #f4f7ff;
  height: 40px;
  margin-top: 25px;
  padding: 0 15px;
  line-height: 40px;
  font-size: 12px;
}
.genjinitem {
  height: 25px;
  line-height: 25px;
  margin: 3px 0;
}

.genjinRadio {
  border: 1px dashed #dcdfe6;
  border-radius: 2px;
  padding: 0px 5px;
  margin-right: 5px;
}
/deep/.ant-table-body {
  max-height: calc(100vh - 450px);
}
</style>
